<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<title>登录</title>
		<link rel="stylesheet" href="/static/layui/css/layui.css">
		<link rel="stylesheet" href="/static/admin-login.css">
	</head>
	<body>
		<div class="container">
			<div class="login-box">
				<form id="loginForm" class="layui-form" action="" method="post">
					<div class="layui-form-item">
						<h2 class="box-title">用户登录</h2>
					</div>
					<div class="layui-form-item">
						<input type="text" name="username" required lay-verify="required" placeholder="教工号/一卡通账号" autocomplete="off" class="layui-input">
					</div>
					<div class="layui-form-item">
						<input type="password" name="password" required lay-verify="required" placeholder="上网账号密码/统一身份认证系统密码" autocomplete="off"
						 class="layui-input">
					</div>
					<!-- <div class="layui-form-item">
						<div class="layui-inline" style="margin-right:2px;width: 120px;">
							<input type="text" name="captcha" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
						</div>
						<div class="layui-inline">
							<img src="" class="captcha" alt="验证码图片" onclick="">
						</div>
					</div> -->
					<div class="layui-form-item">
						<button id="login" class="layui-btn layui-btn-normal layui-btn-fluid login-btn btn">登录</button>
					</div>
				</form>
			</div>
		</div>
		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
	<!--[if lt IE 9]>
      <script src="/static/html5shiv/html5shiv.min.js"></script>
	  <script src="/static/respond/respond.min.js"></script>
    <![endif]-->
		<script src="/static/layui/layui.js"></script>
		<script>
			layui.use(['jquery', 'layer'], function() {
				var $ = layui.jquery,layer = layui.layer;
				var loginAjax, loginAlert;

				$(document).on('click', '#login', function(e) {
					e.preventDefault();
					login();
				}).on('keydown', function(e) {
					if (e.key === 'Enter') {
						if (loginAjax != null || loginAlert != null) {
							e.preventDefault();
							return false;
						}
					}
				});

				function login() {
					let $loginForm = $('#loginForm');
					loginAjax = $.ajax({
						url: '/index.php/login/admin',
						type: 'post',
                        dataType: 'json',
						data: $loginForm.serialize(),
						success: function(res) {
							if (res.code == 200) {
								window.location.href = "/index.php/admin";
							}
							loginAjax = null;
						},
						error: function(res) {
						    //console.log(res.responseJSON.msg)
                            var msg = res.responseJSON.msg,str = '';
							if (res.responseJSON.msg instanceof Object){
                                for(var k in msg){
                                    str = str + msg[k] + '<br>';
                                }
							}else {
							    str = res.responseJSON.msg
							}
                            layer.alert(str, {icon: 2});
							loginAjax = null;
						}
					})
				}
			})
		</script>
	</body>
</html>
